<script setup lang="ts">
import { computed } from 'vue';
import ImageGroup from '@/components/app/ImageGroup.vue';
import type { TAcceptanceData } from '../acceptance.vue';


const { source } = defineProps<{
  source: TAcceptanceData["list"][number]["quesNaireContent"][number];
}>();

const option = computed(() => {
  return source.options.find(e => e.isCheck);
});
</script>

<template>

  <div class="mb-2 px-3 bg-white rounded-xl shadow-lg">

    <div class="py-3 flex justify-between border-b-1 border-#eee">
      <span>{{ source.quesNo }}. {{ source.quesName }}</span>
      <nut-tag :type="option?.isQualified ? 'success' : 'danger'">{{ option?.optionsName }} </nut-tag>
    </div>

    <div class="py-3" v-if="source.picList?.length > 0">
      <div class="mb-2 text-#666 text-sm">照片</div>
      <div>
        <ImageGroup :images="source.picList" />
      </div>
    </div>

  </div>

</template>
